<template>
	<view class="line" :style="[padC, bgColorC]">
		<text class="text" v-if="title">{{title}}</text>
	</view>
</template>

<script setup>
	import { computed } from 'vue';
	
	const props = defineProps({
		title:{
			type: String,
			default: ''
		},
		bgColor: {
			type: String,
			default: ''
		},
		pad:{
			type: Number,
			default: 0
		}
	})
	
	const padC = computed(() => { // 设置边距
		if(props.title && props.pad){
			return `padding: 10rpx ${props.pad}rpx`
		}else{
			return `padding: 10rpx; height: auto;`
		}
	})
	
	const bgColorC = computed(() => { // 设置边距
		if(props.bgColor){
			return `background-color: ${props.bgColor};`
		}
	})
	
</script>

<style lang="less" scoped>
	.line{
		// height: 30rpx;
		background-color: #f1f1f1;
		.text{
			font-size: 30rpx;
			color: #666;
		}
	}
</style>